<template>
	<view class="getShre">
		<!-- 正文内容 -->
		<view class="getShre_box pr">
			<view class="bg">
				<image :src="share_bg" mode=""></image>
			</view>
			<view class="content pa">
				<!-- 头部卡片 -->
				<view class="card">
					<card :card_num="share_detail.share_points" :text_show="true"></card>
				</view>
				<view class="text">
					<view class="info x-f">
						<view class="label">赠送人</view>
						<view class="value x-f">
							<image :src="share_detail.pic_url" mode=""></image>
							<view class="people">{{share_detail.nickname}}</view>
						</view>
					</view>
					<view class="info x-f">
						<view class="label">赠送时间</view>
						<view class="value x-f">
							<view class="">{{share_detail.create_time}}</view>
						</view>
					</view>
					<view class="info x-f">
						<view class="label">备注</view>
						<view class="value x-f">
							<view class="">{{share_detail.remark || '无'}}</view>
						</view>
					</view>
				</view>
				<view class="btn" @tap="submit" :disabled="isReceive" :class="isReceive == false? 'receive': ''">
					立即领取
				</view>
			</view>
		</view>
		<!-- 领取成功 -->
		<success ref="successChild"></success>
	</view>
</template>

<script>
	import {
		mapMutations,
		mapActions,
		mapState,
		mapGetters
	} from 'vuex';
	import card from '../../../components/card.vue'
	import success from './success.vue'
	export default {
		components: {
			card,
			success
		},
		data() {
			return {
				share_bg: this.imgUrl + 'share_bg.png',
				card_num: 0,
				isReceive: true,							//是否已被领取
				obj: {},
			}
		},
		computed: {
			...mapState({
				key: state=> state.member.key,
				share_detail: state=> state.member.shareDetail,
				sharePoint_record: state=> state.member.sharePoint_record,
			}),
		},
		mounted() {
			// 获取方式
			this.obj.key = this.$Route.query.key;
			this.$api('getSharePointsRecord',this.obj).then(res=> {
				this.$store.dispatch('member/get_shareInfo',res.data)
			})
		},
		methods: {
			submit() {
				let obj = {
					key: this.$Route.query.key
				}
				this.$store.dispatch('member/get_receive_points',obj).then(res => {
					
					if (res.status == 1) {
						this.$refs.successChild._data.isSuccess = true
						this.isReceive = false
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import './index.scss';
</style>
<style>
	page {
		background: linear-gradient(#FFF6F4, #FEECE9) !important;
	}
</style>
